<template>
	<page>
		<view class="search-info">
			<view class="search">
				<image src="/static/images/icon/fdj_icon.png"></image>
				<input type="text" maxlength="26" v-model="keyword" @confirm="onSearch" placeholder="ID/手机号">
			</view>
		</view>
<!--		好友列表-->
		<view class="friend-info" v-if="friendInfo.pid">
			<view class="info-title">
				<text>搜索结果</text>
			</view>
			<view class="friend-list">
				<view class="list" @click="onFriend">
					<view class="pic">
						<fui-avatar :src="friendInfo.avatar_pic" width="80" height="80" shape="square"></fui-avatar>
					</view>
					<view class="name-info">
						<view class="name">
							<text>{{friendInfo.nickname}}</text>
						</view>
						<view class="desc">
							<text>{{friendInfo.pid}}</text>
						</view>
					</view>
					<view class="status-info">
						<view class="status" v-if="friendInfo.isFriend === 1">
							<text>已添加</text>
						</view>
						<view class="btn" @click.stop="onAddFriend(friendInfo)" v-else>
							<text>添加</text>
						</view>
					</view>
				</view>
			</view>
		</view>
		<fui-dialog :show="confirmShow"
								title="申请"
								maskClosable
								@click="confirmSubmit"
								@close="onConfirmClose">
			<view class="apply-info">
				<view class="content">
					<textarea placeholder="请输入申请信息" v-model="applyContent"></textarea>
				</view>
			</view>
		</fui-dialog>
	</page>
</template>

<script setup>
import {getCurrentInstance, ref} from "vue";
import {addFriend, findFriend} from "../../api/api";

const { proxy } = getCurrentInstance();
const confirmShow = ref(false);
const keyword = ref('');
const friendInfo = ref({});
// 申请内容
const applyContent = ref('');



/**
 * 查找好友数据
 */
function findFriendData(){
	findFriend({
		pid: keyword.value,
		phone: keyword.value,
	}).then(res =>{
		friendInfo.value = res.data;
	})
}

/**
 * 搜搜点击
 */
function onSearch(){
	findFriendData();
}

/**
 * 好友添加点击
 * @param {Object} item
 */
function onAddFriend(item){
	confirmShow.value = true;
}

/**
 * 确认提交
 */
function confirmSubmit(){
	confirmShow.value = false;
	addFriend({
		to_user_id: friendInfo.value.user_id,
		desc: applyContent.value
	}).then(res =>{
		proxy.$way.toast(res.msg);
		friendInfo.value.isFriend = 1;
	})
}
function onConfirmClose(){
	confirmShow.value = false;
}

/**
 * 好友点击
 */
function onFriend(){
  uni.navigateTo({
    url: `/pages/FriendInfo/FriendInfo?pid=${friendInfo.value.pid}`
  })
}
</script>

<style lang="scss">
	@import "NewFriend.scss";
</style>
